<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>伪类选择器_结构伪类2</title>
    <style>
        /* 选择div的子标签并且为p标签的最后一个儿子标签 看结构一 */
        /*div>p:last-child {*/
        /*    color:red;*/
        /*}*/

        /* 选择div的子标签为第n个的子标签并且该标签要为p标签 (里面可以写公式 公式形式为:an + b )  看结构二  */
        /*div>p:nth-child(3) {*/
        /*    color: green;*/
        /*}*/

        /* 选中div的第一个这个种类的标签 看结构三*/
        /*div>p:first-of-type {*/
        /*    color: green;*/
        /*}*/

        /* 选中div的最后一个这个种类标签 看结构三*/
        /*div>p:last-of-type {*/
        /*    color: green;*/
        /*}*/

        /*  选择第n个这中类型的标签  odd：奇数 even:偶数 */
        div>p:nth-of-type(even) {
            color: skyblue;
        }

    </style>
</head>
<body>
<!--结构一-->
<!--<div>-->
<!--    <p>张三:98</p>-->
<!--    <p>李四:81</p>-->
<!--    <p>王五:71</p>-->
<!--    <p>赵六:66</p>-->
<!--    <p>孙七:55</p>-->
<!--    <p>老八:48</p>-->
<!--</div>-->

<!--结构二-->
<!--<div>-->
<!--    <p>张三:98</p>-->
<!--    <p>李四:81</p>-->
<!--    <p>王五:71</p>-->
<!--    <p>赵六:66</p>-->
<!--    <p>孙七:55</p>-->
<!--    <p>老八:48</p>-->
<!--</div>-->

<!--结构三-->
<div>
    <span>测试</span>
    <p>第一个</p>
    <p>第二个</p>
    <p>第三个</p>
    <p>第四个</p>
    <p>第五个</p>
    <p>第六个</p>
    <p>第七个</p>
    <p>第八个</p>
    <p>第九个</p>
    <p>第十个</p>
    <span>测试2</span>
</div>

</body>
</html>